<template>
  <div>
    <!-- 面包屑导航区 -->
    <el-breadcrumb separator-class="el-icon-arrow-right">
      <el-breadcrumb-item :to="{ path: '/welcome' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item>订单管理</el-breadcrumb-item>
      <el-breadcrumb-item>和目</el-breadcrumb-item>
    </el-breadcrumb>

    <!-- 卡片视图 -->
    <el-card>
      <!-- 筛选区 -->
      <el-row :gutter="20">
        <el-radio-group v-model="querInfo.term">
          <el-radio :label="1">全部</el-radio>
          <el-radio :label="2">区域</el-radio>
          <el-radio :label="3">镇区</el-radio>
          <el-radio :label="4">区长</el-radio>
          <el-radio :label="5">组长</el-radio>
          <el-radio :label="6">业务员</el-radio>
          <el-radio :label="7">公司区域</el-radio>
        </el-radio-group>
        <el-col :span="4">
          <el-input
            v-model="querInfo.searchinput"
            placeholder="请输入内容"
            clearable
          >
            <el-button
              slot="append"
              icon="el-icon-search"
              @click="searchBtn"
            ></el-button>
          </el-input>
        </el-col>
        <el-col :span="13" style="text-align: center">
          <el-radio-group v-model="querInfo.timer">
            <el-radio :label="1">导入时间</el-radio>
            <el-radio :label="2">反馈时间</el-radio>
            <el-radio :label="3">区长接收时间</el-radio>
            <el-radio :label="4">组长接收时间</el-radio>
            <el-radio :label="5">业务员接收时间</el-radio>
          </el-radio-group>
          <!-- 日期筛选 -->
          <el-date-picker
            v-model="querInfo.date"
            type="daterange"
            align="right"
            unlink-panels
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            :picker-options="pickerOptions"
            @change="datechange"
          ></el-date-picker>
        </el-col>
        <el-col :span="7" class="colBtn">
          <el-button @click="Delete" v-if="user.power < 2">删除</el-button>
          <el-button @click="check" v-if="user.power < 2">审核</el-button>
          <el-button @click="send" v-if="user.power < 4">派单</el-button>
          <el-button @click="recallclick">撤单</el-button>
          <el-button @click="takeback">收单</el-button>
          <el-button @click="outorders" v-if="user.power < 3">导出</el-button>
          <!-- 导入文件 -->
          <el-popover placement="left" width="200" v-model="uploadshow">
            <el-upload
              :limit="(filenumber = 1)"
              accept=".xls, .xlsx"
              class="upload-demo"
              ref="upload"
              action="/hx/hm/upload"
              :headers="fileheaders"
              :file-list="fileList"
              :on-success="uploadsuccess"
              :on-progress="onupload"
              :auto-upload="false"
            >
              <el-button slot="trigger" size="small" type="primary"
                >选取文件</el-button
              >
              <el-button
                style="margin-left: 10px"
                size="small"
                type="success"
                @click="submitUpload"
                >上传到和目</el-button
              >
              <div slot="tip" class="el-upload__tip">和目文件上传</div>
            </el-upload>
            <div style="text-align: right; margin: 0">
              <el-button size="mini" type="text" @click="uploadshow = false"
                >取消</el-button
              >
            </div>
            <el-button slot="reference" v-if="user.power < 2">导入</el-button>
          </el-popover>
        </el-col>
      </el-row>

      <!-- 订单列表区 -->
      <el-table
        :data="tableData"
        style="width: 100%"
        :header-cell-style="{ 'text-align': 'center' }"
        :cell-style="{ 'text-align': 'center' }"
        border
        @selection-change="selectorders"
        @row-contextmenu="gomsg"
        max-height="900"
      >
        <el-table-column type="expand" label="展开">
          <template v-slot="props">
            <el-form label-position="left" inline class="demo-table-expand">
              <el-form-item
                v-for="(item, index) in props.row.xlsx"
                :label="index"
                v-if="index !== '客户号码'"
              >
                <span>{{ item }}</span>
              </el-form-item>
            </el-form>
          </template>
        </el-table-column>
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="#" type="index" width="55"></el-table-column>
        <el-table-column label="上传者" prop="uppeople"></el-table-column>
        <el-table-column label="导入时间">
          <template v-slot="scope">
            <i class="el-icon-time"></i>
            <span style="margin-left: 10px">{{
              new Date(scope.row.inputdate).toLocaleDateString()
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="业务员反馈时间" v-if="user.power < 2">
          <template v-slot="scope">
            <i class="el-icon-time"></i>
            <span style="margin-left: 10px">{{
              new Date(scope.row.xlsx.date).toLocaleDateString()
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="改约" v-if="this.querInfo.status === 'gy'">
          <template v-slot="scope">
            <i class="el-icon-time"></i>
            <span style="margin-left: 10px">{{
              new Date(scope.row.otherdate).toLocaleDateString()
            }}</span>
          </template>
        </el-table-column>
        <el-table-column
          label="客户姓名"
          prop="xlsx.客户姓名"
        ></el-table-column>
        <el-table-column label="客户号码" v-if="user.power < 2">
          <template v-slot="scope">
            <i class="el-icon-phone"></i>
            <span style="margin-left: 10px">{{ scope.row.xlsx.客户号码 }}</span>
          </template>
        </el-table-column>
        <el-table-column label="客户号码" v-else>
          <template v-slot="scope">
            <i class="el-icon-phone"></i>
            <span style="margin-left: 10px">{{
              scope.row.xlsx.客户号码.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="区域" prop="xlsx.区域"></el-table-column>
        <el-table-column
          label="客户收件地址"
          prop="xlsx.客户收件地址"
        ></el-table-column>
        <el-table-column label="组长" prop="lead2"></el-table-column>
        <el-table-column label="业务员" prop="lead3"></el-table-column>
        <el-table-column label="备注">
          <template v-slot="scope">
            <span style="margin-left: 10px">{{
              JSON.stringify(scope.row.memo).replace(/"/g, '')
            }}</span>
          </template>
        </el-table-column>
        <el-table-column label="编辑" width="60px" v-if="user.power < 3">
          <template v-slot="scope">
            <el-button
              type="primary"
              icon="el-icon-edit"
              circle
              @click="
                editshow = true
                xlsx = scope.row
              "
            ></el-button>
          </template>
        </el-table-column>
        <el-table-column align="right" prop="status">
          <template slot="header">
            <!-- 订单状态 -->
            <el-dropdown @command="handlemenu">
              <span class="el-dropdown-link">
                订单状态
                <i class="el-icon-caret-bottom el-icon--right"></i>
              </span>
              <el-dropdown-menu slot="dropdown" class="mark">
                <el-dropdown-item command="888">
                  未派单
                  <el-badge :value="status[888]" />
                </el-dropdown-item>
                <el-dropdown-item command="0">
                  未反馈
                  <el-badge :value="status[0]" />
                </el-dropdown-item>
                <el-dropdown-item command="1">
                  改约
                  <el-badge :value="status[1]" />
                </el-dropdown-item>
                <el-dropdown-item command="2">
                  撤单
                  <el-badge :value="status[2]" />
                </el-dropdown-item>
                <el-dropdown-item command="3">
                  收回
                  <el-badge :value="status[3]" />
                </el-dropdown-item>
                <el-dropdown-item command="4">
                  待审核
                  <el-badge :value="status[4]" />
                </el-dropdown-item>
                <el-dropdown-item command="5">
                  通过
                  <el-badge :value="status[5]" />
                </el-dropdown-item>
                <el-dropdown-item command="6">
                  不通过
                  <el-badge :value="status[6]" />
                </el-dropdown-item>
                <el-dropdown-item command="7">
                  回捞
                  <el-badge :value="status[7]" />
                </el-dropdown-item>
                <el-dropdown-item command="999">全部</el-dropdown-item>
              </el-dropdown-menu>
            </el-dropdown>
          </template>
          <template v-slot="scope">
            <el-tag :type="statuscolor[scope.row.status]" disable-transitions>{{
              statustitle[scope.row.status]
            }}</el-tag>
          </template>
        </el-table-column>
      </el-table>
      <!-- 分页区域 -->
      <el-pagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="querInfo.pagenum"
        :page-sizes="[100, 200, 300]"
        :page-size="querInfo.pagesize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
        hide-on-single-page
      ></el-pagination>

      <!-- 审核区 -->
      <el-drawer
        custom-class="demo-drawer"
        title="反馈审核 (ESC键可退出)"
        :visible.sync="drawershow"
        size="400px"
      >
        <!-- 反馈信息 -->
        <table border="6" width="300" cellspacing="0" class="chenkbox">
          <caption>
            {{
              form.tittle + ' 数量:' + tableData.length
            }}
          </caption>
          <tr>
            <th>日期</th>
            <td>{{ new Date(form.date).toLocaleDateString() }}</td>
          </tr>
          <tr>
            <th>业务登记状态</th>
            <td>{{ form.register }}</td>
          </tr>
          <tr>
            <th>办理套餐</th>
            <td>{{ form.success }}</td>
          </tr>
          <tr>
            <th>礼品1</th>
            <td>
              {{
                tableData[checkindex] == null ? '' : tableData[checkindex].gift
              }}
            </td>
          </tr>
          <tr>
            <th>礼品1数量</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : tableData[checkindex].giftnum
              }}
            </td>
          </tr>
          <tr>
            <th>礼品2</th>
            <td>
              {{
                tableData[checkindex] == null ? '' : tableData[checkindex].gift2
              }}
            </td>
          </tr>
          <tr>
            <th>礼品2数量</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : tableData[checkindex].giftnum2
              }}
            </td>
          </tr>
          <tr>
            <th>备注</th>
            <td>{{ form.leave }}</td>
          </tr>
          <tr>
            <th>业务员</th>
            <td>
              {{
                tableData[checkindex] == null ? '' : tableData[checkindex].lead3
              }}
            </td>
          </tr>
        </table>

        <!-- 订单信息 -->
        <table border="6" width="300" cellspacing="0" class="chenkbox">
          <tr>
            <th>区长接收日期</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : new Date(tableData[checkindex].lead1qdate)
                      .toLocaleString('chinese', { hour12: false })
                      .substring(5)
              }}
            </td>
          </tr>
          <tr>
            <th>组长接收日期</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : new Date(tableData[checkindex].lead2qdate)
                      .toLocaleString('chinese', { hour12: false })
                      .substring(5)
              }}
            </td>
          </tr>
          <tr>
            <th>业务员接收日期</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : new Date(tableData[checkindex].lead3qdate)
                      .toLocaleString('chinese', { hour12: false })
                      .substring(5)
              }}
            </td>
          </tr>
          <tr>
            <th>客户姓名</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : tableData[checkindex].xlsx.客户姓名
              }}
            </td>
          </tr>
          <tr>
            <th>客户号码</th>
            <td v-if="user.power < 3">
              {{
                tableData[checkindex] == null
                  ? ''
                  : tableData[checkindex].xlsx.客户号码
              }}
            </td>
          </tr>
          <tr>
            <th>客户收件地址</th>
            <td>
              {{
                tableData[checkindex] == null
                  ? ''
                  : tableData[checkindex].xlsx.客户收件地址
              }}
            </td>
          </tr>
        </table>

        <el-row>
          <el-col :span="8">
            <el-button
              icon="el-icon-caret-left"
              type="success"
              circle
              @click="sub"
            ></el-button>
          </el-col>
          <el-col :span="8" class="checktag">
            <el-tag
              type="success"
              :effect="
                checkindex === this.tableData.length - 1 ? 'light' : 'dark'
              "
              >{{ '第' + (checkindex + 1) + '条' }}</el-tag
            >
          </el-col>
          <el-col :span="8" class="colBtn">
            <el-button
              icon="el-icon-caret-right"
              type="success"
              circle
              @click="add"
            ></el-button>
          </el-col>
        </el-row>

        <table border="6" width="400" cellspacing="0" class="imagetable">
          <tr>
            <th>客户手机IMEI登记</th>
            <th>和商汇登记IMEI</th>
            <th>上门合照</th>
          </tr>
          <tr>
            <td>
              <el-image
                fit="scale-down "
                style="width: 100px; height: 100px"
                :src="form.image1"
                :preview-src-list="[form.image1]"
              ></el-image>
            </td>
            <td>
              <el-image
                fit="scale-down "
                style="width: 100px; height: 100px"
                :src="form.image2"
                :preview-src-list="[form.image2]"
              ></el-image>
            </td>
            <td>
              <el-image
                fit="scale-down "
                style="width: 100px; height: 100px"
                :src="form.image3"
                :preview-src-list="[form.image3]"
              ></el-image>
            </td>
          </tr>
        </table>
        <div class="demo-drawer__footer">
          <el-button slot="reference" type="success" plain @click="pass(1)"
            >通过</el-button
          >
          <el-button slot="reference" type="success" plain @click="pass(0)"
            >不通过</el-button
          >
          <el-button slot="reference" type="danger" plain @click="backpass"
            >反审</el-button
          >
        </div>
      </el-drawer>
    </el-card>

    <!-- 派单对话框 -->
    <el-dialog
      :title="'派单 已选: ' + orders.length"
      :visible.sync="sendDialogVisible"
      width="300px"
    >
      <!-- 树形控件 -->
      <el-tree
        :props="treeProps"
        :load="loadProps"
        lazy
        show-checkbox
        accordion
        check-strictly
        node-key="_id"
        ref="treeRef"
      ></el-tree>
      <span slot="footer" class="dialog-footer">
        <el-button @click="sendDialogVisible = false">取 消</el-button>
        <el-button
          type="primary"
          @click="sendorders($refs.treeRef.getCheckedNodes())"
          >确 定</el-button
        >
      </span>
    </el-dialog>

    <!-- 订单跟踪 -->
    <el-dialog title="查看进度" :visible.sync="goDialogVisible" width="400px">
      <el-timeline reverse>
        <el-timeline-item
          v-for="(activity, index) in goDate"
          size="large"
          :key="index"
          :icon="activity.icon"
          :type="activity.type"
          :timestamp="
            new Date(activity.time).toLocaleString('chinese', { hour12: false })
          "
          >{{ activity.context }}</el-timeline-item
        >
      </el-timeline>
    </el-dialog>

    <!-- 编辑订单 -->
    <el-dialog title="编辑订单" :visible.sync="editshow" width="300px">
      <label for v-for="(item, key, index) in xlsx.xlsx">
        {{ key }}
        <input type="text" v-model="xlsx.xlsx[key]" />
      </label>
      <div>
        <el-button @click="editOrders" type="primary" style="margin: 10px 30%"
          >修 改</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>

<script>
const axios = require('axios')
import { Loading } from 'element-ui'
export default {
  data() {
    return {
      editshow: false,
      checkindex: 0,
      // 表格数据
      tableData: [],
      xlsx: [],
      // 审核区表格
      form: {},
      _id: '',
      // 日期快捷选择
      pickerOptions: {
        shortcuts: [
          {
            text: '最近一周',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
              picker.$emit('pick', [start, end])
            },
          },
          {
            text: '最近一个月',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
              picker.$emit('pick', [start, end])
            },
          },
          {
            text: '最近三个月',
            onClick(picker) {
              const end = new Date()
              const start = new Date()
              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
              picker.$emit('pick', [start, end])
            },
          },
        ],
      },
      // 文件长传组件显示与隐藏
      uploadshow: false,
      // 选择的文件
      fileList: [],
      //  给上传组件添加请求参数
      fileheaders: {
        Authorization: window.localStorage.getItem('token'),
      },
      // loading实例对象
      loading: {},
      // 反馈抽屉显示
      drawershow: false,

      // 搜索请求参数 get
      querInfo: {
        // 页数
        pagenum: 1,
        // 每页数量
        pagesize: 300,
        // 搜索框的值
        searchinput: '',
        // 订单状态
        status: 999,
        term: 1,
        timer: 1,
      },
      // 总数量
      total: 0,
      // 派单对话框
      sendDialogVisible: false,
      // 人物列表数据
      peopleList: [],
      //   树形控件的属型绑定对象
      treeProps: {
        label: 'username',
        children: 'children',
        isLeaf: 'leaf',
      },
      //  选择框内容
      orders: [],
      // 订单跟踪对话框
      goDialogVisible: false,
      // 订单状态数据
      goDate: [],
      status: {},
      statustitle: {
        0: '未反馈',
        1: '改约',
        2: '撤单',
        3: '收回',
        4: '待审核',
        5: '通过',
        6: '不通过',
        7: '回捞',
      },
      statuscolor: {
        0: 'primary',
        1: 'info',
        2: 'info',
        3: 'info',
        4: 'primary',
        5: 'success',
        6: 'error',
        7: 'info',
      },
      // 用户信息
      user: {},
    }
  },
  created() {
    if (window.sessionStorage.getItem('hmquery') === null) {
      this.getOrderslist()
    } else {
      this.querInfo = JSON.parse(window.sessionStorage.getItem('hmquery'))
      this.getOrderslist()
    }
    this.user = JSON.parse(window.localStorage.getItem('user'))
  },
  methods: {
    // 表格序号排序
    sortByid(obj1, obj2) {
      return obj1.id > obj2.id
    },
    //点击上传服务器
    submitUpload() {
      this.$refs.upload.submit()
    },
    // 文件上传时钩子
    onupload() {
      this.loading = Loading.service({
        lock: true,
        text: '正在解析, 请勿操作!',
        fullscreen: true,
        background: 'rgba(0, 0, 0, 0.7)',
      })
    },
    // 上传文件成功钩子
    uploadsuccess(response, file) {
      this.loading.close()
      if (response.meta.status !== 200) {
        return this.$message.error(response.meta.msg)
      }
      this.$message.success(response.meta.msg)
    },
    // 获取订单列表
    async getOrderslist() {
      const { data: res } = await this.$http.get('hx/hm/orderslist', {
        params: this.querInfo,
      })
      if (res.meta.status !== 200) {
        window.sessionStorage.clear()
        return this.$message.error(res.meta.msg)
      }
      this.tableData = res.data
      this.total = res.total
      this.status = res.status
      this.$message.success('找到: ' + res.total + ' 条')
      // 本期储存搜索
      window.sessionStorage.setItem('hmquery', JSON.stringify(this.querInfo))
    },
    // 日期选择框变化触发搜索
    datechange(d) {
      this.getOrderslist()
    },
    // 搜索按钮点击
    searchBtn() {
      this.getOrderslist()
    },
    // 头部菜单
    handlemenu(command) {
      this.querInfo.status = command
      this.getOrderslist()
    },
    // 派单按钮点击
    async sendorders(people) {
      if (this.orders.length === 0) {
        return this.$message.error('请选择订单! ')
      }

      if (people.length === 0) {
        return this.$message.error('请选择收单人! ')
      }
      let orders = []
      this.orders.forEach((ele, item) => {
        orders.push(ele._id)
      })

      const { data: res } = await this.$http.put(
        '/hx/hm/sendorders',
        {
          people: people,
          orders: orders,
        },
        {
          params: this.querInfo,
        }
      )

      if (res.meta.status !== 200) {
        return this.$message.error(res.meta.msg)
      }
      this.$message.success(res.meta.msg)
      this.orders.forEach((ele, item) => {
        orders.push(ele._id)
        for (let key in this.tableData) {
          if (ele._id == this.tableData[key]._id) {
            this.tableData.splice(key, 1)
          }
        }
      })
    },
    // 删除订单
    async Delete() {
      if (this.orders.length === 0) {
        return this.$message.error('请选择订单! ')
      }
      let orders = []
      this.orders.forEach((ele, item) => {
        orders.push(ele._id)
      })
      const { data: res } = await this.$http.put('/hx/hm/delete', {
        _id: orders,
      })
      if (res.meta.status !== 200) return this.$message.error(res.meta.msg)

      this.$message.success(res.meta.msg)
      this.orders.forEach((ele, item) => {
        orders.push(ele._id)
        for (let key in this.tableData) {
          if (ele._id == this.tableData[key]._id) {
            this.tableData.splice(key, 1)
          }
        }
      })
    },
    // 选择事件
    selectorders(val) {
      this.orders = val
    },
    // 动态加载人物
    async loadProps(node, resolve) {
      const { data: res } = await this.$http.get('hx/usertree', {
        params: node.data,
      })
      if (res.meta.status !== 200) return this.$message.error(res.meta.msg)
      // 限制最高子节点 这里用isLeaf 不需要这个
      // if (node.level > 4) return resolve([])
      resolve(res.data)
    },
    // 审核
    pass(success) {
      this.$prompt('确定审核吗?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputPlaceholder: '输入点什么',
      })
        .then(async ({ value }) => {
          const { data: res } = await this.$http.get('hx/hm/lock', {
            params: { _id: this._id, memo: value, success: success },
          })
          if (res.meta.status !== 200) {
            return this.$message.error(res.meta.msg)
          }
          return this.$message.success(res.meta.msg)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消',
          })
        })
    },
    // 反审
    backpass() {
      this.$alert('确定反审(回捞)吗?', '标题名称', {
        confirmButtonText: '确定',
        closeOnClickModal: true,
        callback: async (action) => {
          if (action === 'confirm') {
            const { data: res } = await this.$http.get('hx/hm/backpass', {
              params: { _id: this._id },
            })
            if (res.meta.status !== 200) {
              return this.$message.error(res.meta.msg)
            }
            return this.$message.success(res.meta.msg)
          }
        },
      })
    },
    // 切换审核订单
    add() {
      this.checkindex += 1
      if (this.checkindex > this.tableData.length - 1) {
        this.checkindex = this.tableData.length - 1
      } else {
        this.form = this.tableData[this.checkindex].form
        this._id = this.tableData[this.checkindex]._id
      }
    },
    sub() {
      this.checkindex -= 1
      if (this.checkindex < 0) {
        this.checkindex = 0
      } else {
        this.form = this.tableData[this.checkindex].form
        this._id = this.tableData[this.checkindex]._id
      }
    },
    // 监听pagesize 改变的事件
    handleSizeChange(newSize) {
      this.querInfo.pagesize = newSize
      this.getOrderslist()
    },
    // 监听页码值 改变的事件
    handleCurrentChange(newPage) {
      this.querInfo.pagenum = newPage
      this.getOrderslist()
    },
    // 导出文件
    async outorders() {
      let temp = this.querInfo.pagesize
      this.querInfo.pagesize = 999
      const res = await axios({
        method: 'get',
        url: '/hx/hm/outhm',
        params: this.querInfo,
        responseType: 'blob',
      }).catch((err) => {
        return this.$message.error('下载失败')
      })
      this.$confirm('下载链接已创建, 是否下载?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
      })
        .then(() => {
          let link = document.createElement('a')
          link.href = window.URL.createObjectURL(new Blob([res.data]))
          link.download =
            JSON.parse(window.localStorage.getItem('user')).username + '.xls'
          document.body.appendChild(link)
          link.click()
          document.body.removeChild(link)
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消',
          })
        })
      this.querInfo.pagesize = temp
    },
    // 撤单
    recall() {
      if (this.orders.length === 0) {
        return this.$message.error('请选择订单! ')
      }

      let ordersid = []
      this.orders.forEach((item, index) => {
        ordersid.push(item._id)
      })

      this.$prompt('已选: ' + ordersid.length, '撤 单', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        inputPlaceholder: '输入点什么',
      })
        .then(async ({ value }) => {
          const { data: res } = await this.$http.get('hx/hm/backout', {
            params: {
              _id: ordersid,
              recalltext: value,
            },
          })
          if (res.meta.status !== 200) {
            return this.$message.error(res.meta.msg)
          }
          this.$message.success(res.meta.msg)
          this.getOrderslist()
        })
        .catch(() => {
          this.$message({
            type: 'info',
            message: '已取消',
          })
        })
    },
    // 收单
    takeback() {
      if (this.orders.length === 0) {
        return this.$message.error('请选择订单! ')
      }

      let ordersid = []
      this.orders.forEach((item, index) => {
        ordersid.push(item._id)
      })

      this.$alert('已选: ' + ordersid.length + ' 条! 确定收回吗?', '收 回', {
        confirmButtonText: '确定',
        callback: async (action) => {
          if (action === 'confirm') {
            const { data: res } = await this.$http.get('hx/hm/takeback', {
              params: { _id: ordersid },
            })
            if (res.meta.status !== 200) {
              return this.$message.error(res.meta.msg)
            }
            this.$message.success(res.meta.msg)
            this.getOrderslist()
          }
        },
      })
    },
    // 右键跟踪显示
    gomsg(row, column, event) {
      this.goDate = row.msg
      this.goDialogVisible = true
    },
    // 审核显示
    check() {
      this.form = this.tableData[this.checkindex].form
      this._id = this.tableData[this.checkindex]._id
      this.drawershow = true
    },
    // 派单显示
    send() {
      this.sendDialogVisible = true
    },
    // 撤单显示
    recallclick() {
      this.recall()
    },
    // 编辑订单信息
    async editOrders() {
      const { data: res } = await this.$http.get('/hx/hm/editOrders', {
        params: { _id: this.xlsx._id, xlsx: this.xlsx.xlsx },
      })

      if (res.meta.status !== 200) {
        return this.$message.error(res.meta.msg)
      }
      this.$message.success(res.meta.msg)
    },
  },
}
</script>

<style lang="less" scoped>
.el-dropdown-link {
  color: #409eff;
  cursor: pointer;
}

.el-date-editor.el-input,
.el-date-editor.el-input__inner {
  width: 260px;
}

.colBtn {
  text-align: right;
}

.chenkbox {
  margin: 0 50px;
  text-align: center;

  caption {
    color: mediumpurple;
    font-weight: bold;
    font-size: 30px;
  }

  td {
    color: #409eff;
  }
}

.demo-drawer__footer {
  float: right;
}

.mark {
  .el-badge {
    float: right;
  }
}

.imagetable {
  .el-image {
    margin: 0 12px;
  }
}

.checktag {
  .el-tag {
    margin: 5px 40px;
  }
}

.el-radio-group {
  position: absolute;
  top: -18px;
}
</style>